<template>
    <view class="layout">
        <uni-header :title="'我的笔记详情'"></uni-header>
        <view class="content">
            <view class="note-title">{{noteData.note_name}}</view>
            <view class="note-text">{{noteData.comment}}</view>
            <view class="option-btn">
                <u-button @click="editClick" type="primary" :plain="true" :hairline="true" icon="edit-pen-fill" text="修改笔记"></u-button>
                <u-button type="error" :plain="true" :hairline="true" icon="trash-fill" text="删除笔记"></u-button>
            </view>
        </view>
    </view>
</template>

<script>
    import { noteDetails } from '@/api/note'
    export default {
        data() {
            return {
                params:{
                    id:"",
                    type:"",
                    deviceId:this.$store.state.user.deviceId
                },
                noteData:{}
            }
        },
        created(){
            noteDetails(this.params).then(res=>{
                this.noteData = res.record;
                console.log(res)
            })
        },
        onLoad(option){
            this.params.id = option.id;
            this.params.type = option.type;
        },
        methods: {
            handleToInfo() {
                this.$tab.navigateTo('/pages/mine/info/index')
            },
            editClick(){
                this.$tab.navigateTo('/pages/mine/note/edit?id='+this.params.id+'&type='+this.params.type)
            },
        }
    }
</script>

<style lang="scss">
    page {
        background-color: #f5f6f7;
        .content{
            background: #fff;
            .note-title{
                font-size: 24px;
                color:#666;
                border-bottom: 1px solid #eee;
                padding: 10px 15px;
            }
            .note-text{
                margin-top: 15px;
                padding: 0 15px 15px;
                font-size: 14px;
                color:#3b4144;
            }
            .option-btn{
                display: flex;
                padding: 10px 5px;
                .u-button{
                    margin: 0 10px;
                }
            }

        }
    }
</style>
